<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        //数组的解构
        // let [x, y] = [1, 2];
        // console.log(x, y);
        // //剩余运算符
        // let [a,b,...rest]=[1,2,3,4,5,6];
        // console.log(a,b,rest);//rest为[3,4,5,6]
        // //可忽略
        // let[c,,d]=[1,2,3];
        // console.log(c,d);
        // //不完全解构
        // let [e,f]=[1];
        // console.log(e,f);//f匹配不到对应的值，所有打印出来f为undefined
        // //解构默认值
        // let[h,k=2]=[1];
        // console.log(h,k);//指定了默认值k=2
        // //字符串解构
        // let [o,p,q,r,s]='hello';
        // console.log(o,p,q,r,s);
        //总结：当数组进行结构时，用剩余运算符rest，将剩余的值解构到rest。当左边模式变量少于右边的值的个数，可以忽略超出位数的值
        //当左多右少时，解构不成功的赋值为undefined。解构可以指定默认值，字符串也可以结构，因为此时字符串是一个类数组。
        
        //解构两个交换变量的值
        // var a=10;
        // var b=20;
        // console.log(a,b);
        // [a,b]=[b,a];//使用数组的解构交换两个变量的值
        // console.log(a,b);



        // 2.3.2对象的解构赋值
        // let{age,name}={name:'jack',age:20}
        // console.log(name,age);

        //用法2
        // let width=600;
        // let height=800;
        // let depth;
        // console.log(width,height);
        // let size={
        //     width:200,
        //     height:300,
        // };
        // //代码块语句不允许出现在赋值语句左侧，需加小括号变成表达式
        // ({width,height}=size);
        // console.log(width,height);//200 300
        // //对象中不存在或者与变量同名。
        // ({width,height,depth}=size);
        // console.log(width,height,depth);//200 300 undefined 
        // //给解构的变量设置默认值
        // ({width,height,depth=400}=size);
        // console.log(width,height,depth);//200 300 400
        // //对象属性赋值给不同名变量
        // let personName,name,age;
        // ({name:personName,age}={name:'tom',age:20});
        // console.log(personName,name,age);//解构时变量名与属性名不一致，则可以通过冒号运算符将其与属性名对应
        

        //数值型和布尔值的包装对象都有toString属性，因此变量s和b都能取到对应的值
        //只要等号右边的值不是对象或者数组，就会先将其转化为对象。由于undefind和null无法转化为对象，所以无法对它们进行解构赋值，否则报错
        // let {toString:s}=123;
        // console.log(s===Number.prototype.toString);
        // let {toString:b}=true;
        // console.log(b===Boolean.prototype.toString);

        //函数解构赋值
        // function add([x,y]){//add(里面参数是一个数组)
        //     return x+y;
        // }
        // let result=add([1,2]);//传入参数那一刻，数组参数就被解构成变量x，y。对于函数内部来说能接收的参数就是x和y
        // console.log(result);
        
        //move的参数是一个对象，通过对move参数进行解构，得到变量x,y的值。如果解构失败，那么x和y等于默认值
        function move({x=0,y=0}={}){
            return [x,y];
        }
        console.log(move({x:3,y:8}));//[3,8]
        console.log(move({x:3}));//[3,0]
        console.log(move({}));//[0,0]
        console.log(move());//[0,0]

    
    </script>
</body>

</html>